<template>
	<view class="content">
		<view class="top_item">
			<view class="top_price text-bold">￥{{paymoney}}</view>
			<view class="top_ordernum" v-if="!payment">订单编号：{{orderSn}}</view>
		</view>
		<paymantcom :type="type" @selectchoose='selectchoose' @selecttomima='selecttomima'></paymantcom>
		<!-- 支付密码 -->
		<passkeyborad :show="show" @close="close" @makesure="makesure"></passkeyborad>
	</view>
</template>

<script>
	import {
		payorder,
		headlook,
		OrderPay,
		experience
	} from '@/api/personal.js'
	import passkeyborad from '../../components/yzc-paykeyboard/yzc-paykeyboard.vue';
	import paymantcom from '../../components/payment-com.vue';
	export default {
		components: {
			passkeyborad,
			paymantcom
		},
		data() {
			return {
				type: 1,
				// show: false,
				show: {
					showStatus: false
				},
				ordernumber: '',
				paymoney: '',
				pagetype: '',
				viptype: '',
				id: '',
				pay_pwd: '',
				payment: true,
				oid: '',
				price: '',
				orderSn: '',
				ontype: ''
			}
		},
		onLoad(option) {
			console.log(option);
			this.payment = option.payment
			this.paymoney = option.price
			this.viptype = option.type
			this.id = option.id
			this.oid = option.oid
			this.price = option.price
			this.orderSn = option.orderSn
			this.ontype = option.type
			this.getInfo()
		},
		methods: {
			ruzhulist() {

			},
			goback() {
				uni.navigateBack({
					delta: 1
				})
			},
			selectchoose(val) {
				this.type = val
				// val:1支付宝,2微信,3余额
			},

			close() {
				console.log(55)
				this.show.showStatus = false
				// this.show = false
			},
			makesure(e) {
				this.show.showStatus = false
				var obj = {}
				if (this.payment) {
					var obj = {
						vip_type: this.viptype,
						pay_type: 3,
						pay_pwd: e,
						// o_id:this.id
					};
					payorder(obj).then(res => {
						// this.$common.requests('/api/order/pay', obj).then(res => {
						if (res.code == 1) {
							this.$msg(res.msg)
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 800)
						} else {
							if (this.payment) {
								this.$msg(res.msg)
							} else {
								setTimeout(() => {
									uni.redirectTo({
										url: '../Brush/testDetL?id=' + this.id
									})
								}, 800)
							}
						}
					})
				} else {
					var obj = {
						o_id: this.oid,
						pay_pwd: e
					};
					OrderPay(obj).then(res => {
						if (res.code == 1) {
							this.$msg(res.msg)
							if (this.ontype == 1) {
								setTimeout(() => {
									uni.navigateBack({
										delta: 1
									})
								}, 800)
							} else {
								setTimeout(() => {
									uni.redirectTo({
										url: '../Brush/testDetL?id=' + this.id
									})
								}, 800)
							}
					
						} else {
							this.$msg(res.msg)
						}
					})
				}

				
			},
			getInfo() {
				var obj = {};
				headlook(obj).then(res => {
					if (res.code == 1) {
						this.pay_pwd = res.data.pay_pwd
					}
				})
			},
			selecttomima() {
				this.type == 0 ? this.tomima() : this.goPay(this.categorytype)
			},
			tomima() {

				if (this.pay_pwd == null) {
					this.$msg('请设置余额支付密码')
				} else {
					this.show.showStatus = true
				}
			},
			goPay() {
				var type = ''
				var provider = ''
				console.log(this.type);
				if (this.type == 1) {
					type = 'wechat'
					provider = 'wxpay'
				} else {
					type = 'alipay'
					provider = 'alipay'
				}
				var obj = {}
				console.log(this.payment);
				if(this.payment){
					obj = {
						vip_type: this.viptype,
						pay_type: this.type,
						pay_pwd: '',
						// o_id:this.id
					};
					payorder(obj).then(res => {
						this.$msg(res.msg)
						uni.requestPayment({
							provider: provider,
							orderInfo: res.data,
							success: function(res) {
								console.log('success:' + JSON.stringify(res));
								uni.navigateBack({
									delta: 1
								})
							},
						 fail: function(err) {
								console.log('fail:' + JSON.stringify(err));
							}
						});
					})
				}else{
					var obj = {
						o_id: this.oid,
						type,
						method: 'app'
					};
					experience(obj).then(res => {
						console.log(res);
						if (res.code == 0) {
							this.$msg(res.msg);
						} else {
							uni.requestPayment({
								provider: provider,
								orderInfo: JSON.stringify(res),
								success: function(res) {
									console.log('success:' + JSON.stringify(res));
									uni.redirectTo({
										url: '../Brush/testDetL?id=' + id
									})
								},
								fail: function(err) {
									console.log(err);
									console.log('fail:' + JSON.stringify(err));
								}
							});
					
						}
					})
				}
				
				
			}


		}
	}
</script>

<style>
	.content {
		width: 100vw;
		height: 100%;
		overflow: hidden;
		background-color: #F5F5F5;
	}

	.top-kong {
		width: 100%;
		height: var(--status-bar-height);
		background-color: #FFFFFF;
	}

	.border {
		width: 100%;
		height: 100rpx;
		padding: 0 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background-color: #FFFFFF;
	}

	.border image {
		width: 20rpx;
		height: 36rpx;
	}

	.border_start {
		display: flex;
		align-items: center;
	}

	.border_title {
		font-size: 34rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #303030;
	}

	.border_end {
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
		text-align: end;
	}

	.border_end image {
		width: 33rpx;
		height: 36rpx;
	}

	.item_box {
		width: 100%;
		height: 700rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		overflow: hidden;
	}

	.top_item {
		width: 100%;
		height: 300rpx;
		color: #FF4145;
		font-size: 72rpx;
		background-color: #F5F5F5;
		text-align: center;
		padding: 80rpx;
	}

	.top_price {
		font-size: 72rpx;
		font-weight: bold;
		color: #FF4145;
	}

	.top_ordernum {
		font-size: 24rpx;
		color: #333333;
	}

	.pay_item {
		width: 96%;
		height: 100rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: solid 1rpx #E5E5E5;
		margin-left: 4%;
		padding-right: 30rpx;
	}

	.pay_title {
		width: 530rpx;
		height: 100rpx;
		display: flex;
		align-items: center;
		font-size: 28rpx;
	}

	.pay_title1 {
		width: 530rpx;
		height: 100rpx;
		display: flex;
		align-items: center;
		font-size: 28rpx;
	}

	.pay_icon {
		width: 38rpx;
		height: 40rpx;
	}

	.pay_icon1 {
		width: 40rpx;
		height: 35rpx;
	}

	.pay_selicon {
		width: 36rpx;
		height: 36rpx;
	}

	.pay_selicon image {
		width: 36rpx;
		height: 36rpx;
	}

	.btns {
		width: 86%;
		height: 88rpx;
		background: #FFDD47;
		border-radius: 10rpx;
		margin: 80rpx auto 0;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 30rpx;
		color: #333333;
		position: absolute;
		bottom: 3%;
		left: 6.7%;
	}

	.njpns {
		width: 36rpx;
		height: 36rpx;
	}

	.pay_title {
		width: 100%;
		height: 100rpx;
		padding: 0 30rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.pay_line {
		width: 4rpx;
		height: 20rpx;
		background: #FFDD47;
		border-radius: 2rpx;
		margin-right: 10rpx;
	}
</style>
